<template>
	<view class="content">
		<view class="user-info">
			<view class="swiperBox">
				<swiper class="swiperContainer" :autoplay="false" :interval="3000" :duration="1000" @change="changeIndex">	
					<swiper-item v-for="(item,index1) in selectItem.picUrls" :key="index1">
						<image class="swiperItem" :src="item" mode="aspectFill"></image>
					</swiper-item>
				</swiper>
				<view class="cal" v-if="picUrlsLength > 1">
					<text>{{swiperIndex}}</text>/{{picUrlsLength +1}}
				</view>
			</view>
			<view class="suitGView" v-if="type == '1'" >
				<!-- 套装 -->
				<view class="suitItem" v-for="(item,index1) in itemListG" :key="index1" @click="btnsuitItemClick(index1)">
					<image :class="index1 == selectIndex ? 'suitItemActive':''"   :src="item.picUrl" mode="aspectFill"></image>
				</view>
			</view>
			<view class="topView">
				<view class="btnLeft" @click="toSetting">
					<image class="setIcon" src="../../static/universal_back_trans.png" mode="widthFix" ></image>
				</view>
				<view class="lab2" @click="btnDetAll">
					<image class="custom" src="../../static/menu_custom_icon.png" mode="widthFix"></image>客服
				</view>
			</view>
		</view>
		<view class="detail">
			<view class="titileG">
				<view class="labIzRequired" v-if="selectItem.izRequired == 1">{{msgDict.must}}</view>
				<view class="title">{{selectItem.title}}</view>
			</view>
			<block v-if="msgDict.must == '必选'">
				<view class="needLab" v-if="selectItem.izRequired ==1">限{{selectItem.maxNum}}套</view>
			</block>
			<block v-else>
				<view class="needLab" v-if="selectItem.izRequired ==1">Limited {{selectItem.maxNum}}set</view>
			</block>
			<view class="detailNum">
				<view class="moneyG">
					<view class="detailMoney">￥<text>{{selectItem.price}}</text></view>
				</view>
				
				<view class="detailBtnAdd showBtnBackColor" @click="btnSpecifications">{{msgDict.AddCart}}</view>
			</view>
		</view>
		<view class="jiesuan-box" :style="'z-index:'+zIndex+';'">
			<view class="left-price">
				<view class="all_select_box" @click="btnOpencartClick">
				  <uni-icons type="cart-filled" color="#fff" size="25"></uni-icons>
				  <view v-if="orderNum >0" class="seleNum">{{orderNum}}</view>
				</view>
				<view class="total">
					<block v-if="msgDict.must == '必选'"><view>已选择{{orderNum}}件产品</view></block>
					<block v-else><view>select {{orderNum}}</view></block>
					<view class="totalMoney">¥ {{ showPrice }}</view>
				</view>
			</view>
			<view class="to-pay-btn" @click="toPayOrder">
				{{msgDict.submit}}
			</view>
		</view>
<uni-popup ref="popupAddCart" type="center" :maskClick="false">
	<view class="popupAddCartCon">
		<!-- 尺寸选择弹出窗 -->
		<view class="titleG">
			<view class="title">
				<view class="labIzRequired" v-if="selectItem.izRequired ==1">{{msgDict.must}}</view>
				<view class="labTitle">{{selectItem.title}}</view>
			</view>
			<uni-icons type="closeempty" size="25" color="#ccc" @click="btnClose"></uni-icons>
		</view>
		<view class="selectSku" v-if="type == '2'">
			{{msgDict.size}}：<text v-if="skuList.selIndex == -1">{{msgDict.noSize}}</text><text v-else>{{skuList.selItem}} 库存：{{skuList.selStock}}</text>
		</view>
		<view class="selefctList">
			<block v-if="msgDict.must == '必选'">
				<view class="needLab" v-if="selectItem.izRequired ==1">限{{selectItem.maxNum}}套</view>
			</block>
			<block v-else>
				<view class="needLab" v-if="selectItem.izRequired ==1">Limited {{selectItem.maxNum}}set</view>
			</block>
			<view class="selectTitle">{{msgDict.size}}：</view>
			<view class="selectItems">
				<view class="keyItem" v-for="(item,index) in skuList.data" :key="index"  :class="type == '2'&&item.izStock == 0?'keyItemZero':skuList.selIndex == index?'keyItemActive':''"
				 @click="btnSizeClick(item,index)">
					{{item.value}}
				</view>
			</view>
		</view>
		<view class="buy-num">
			<view class="buy-num-title">
				￥<text>{{selectItem.price}}</text>
				<view class="selSku" v-if="type == '1'&&skuList.selIndex >-1">
					{{msgDict.size}}：({{skuList.selItem}})
				</view>
			</view>
			<numbox v-if="skuList.selNum >0" :title="skuList.selNum" @clickLeft="btnNumboxDetClick" @clickRight="btnNumboxAddClick"></numbox>
			<view v-else class="btnAdd showBtnBackColor" @click="btnAddCartClick($event)">
				{{msgDict.AddCart}}
			</view>
		</view>
	</view>
</uni-popup>
<!-- 购物车列表 -->
<uni-popup ref="popup" type="bottom">
	<view class="popupContent">
		<view class="titleG">
			<view class="popCheck" @click="btnChangeCheckbox()">
				<uni-icons :type="allSelCheak?'checkbox-filled':'checkbox'" :color="allSelCheak?'#5360FF':'#ccc'" size="20"></uni-icons>	
				<view class="classCheak">{{msgDict.all}}</view>
			</view>
			
			<view class="popDelete"  @click='colsePopup'>
				<uni-icons type="trash" color="#BEBEBE" size="15"></uni-icons>{{msgDict.delete}}
			</view>
		</view>
		<scroll-view class="coupons" scroll-y="true" :style="'max-height: '+maxHight+'px;'">
			<view class="vailable" v-for="(item, index) in cartList" :key="index">
				<view class="goodsItem">
					<view class="check" @tap.stop="btnselectedClick(index,item.isChecked)">
						<uni-icons :type="item.isChecked?'checkbox-filled':'checkbox'" :color="item.isChecked?'#5360FF':'#ccc'" size="20"></uni-icons>
					</view>
					<view class="goodsInfo">
						<view class="img-box">
							<image mode="aspectFill" :src="item.pic" class="img" />
							<block v-if="msgDict.must == '必选'">
								<view class="backView" v-if="item.izWarning == '1'">仅剩{{item.stock}}件</view>
							</block>
							<block>
								<view class="backView" v-if="item.izWarning == '1'">Limited {{item.stock}}set</view>
							</block>
						</view>
						<view class="text-box">
							<view class="goods-title">
								<view class="two-omit  ellipsis--2">{{item.goodsName}}</view>
								<view class="goods-price">¥ {{item.price}}</view>
							</view>
							<view class="itemBottom">
								<view class="goods-lable">{{item.size.data[0].value}}</view>
								<!-- 有效商品 -->
								<numbox :title="item.num" @clickLeft="btnPopDetClick(index)" @clickRight="btnPopAddClick(index)"></numbox>
							</view>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</uni-popup>
<!-- 必须商品 -->
<uni-popup ref="popNecessary" type="center">
	<view class="popNeedContent">
		<view class="titleG">
			<view class="popCheck">{{msgDict.addMust}}</view>
			<view class="popDelete">
				<uni-icons type="closeempty" color="#ccc" size="20" @click='btncolseNeedPopupClick'></uni-icons>
			</view>
		</view>
		<view class="needGoods">
			<scroll-view class="coupons" scroll-y="true" :style="'max-height: '+maxHight+'px;'">
				<view class="vailable" v-for="(item, index) in necessaryArr" :key="index">
					<view class="goodsItem">
						<view class="goodsInfo">
							<view class="img-box">
								<image mode="aspectFill" :src="item.picUrl" class="img" />
							</view>
							<view class="goodsDetailBox">
								<view class="goods-title">
									<view class="two-omit  ellipsis--2">{{item.title}}</view>
									<view class="needLab">{{msgDict.must}}</view>
									<view class="goods-price">¥ {{item.price}}</view>
								</view>
								<view class="itemBottom">
									<view class="needNum" v-if="item.maxNum == 1">*1</view>
									<!-- 有效商品 -->
									<numbox v-else :title="item.needNum" @clickLeft="btnNeedDetClick(index,item.needNum)" @clickRight="btnNeedAddClick(index,item.needNum)"></numbox>
									
									<view class="goodSize">
										{{msgDict.size}}<view class="btnSize" @click="btnNeedSizeClick(index)">{{item.showSizeStr}}</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>	
			</scroll-view>
		</view>
		<view class="btnAddAllGroup">
			<view class="btnAddAll showBtnBackColor" @click="btnAddAllClick">{{msgDict.AddShop}}</view>
		</view>
	</view>	
</uni-popup>
<uni-popup ref="popSzieData" type="bottom">
	<view class="categoryContent">
		<view class="pickerBtn">
			<view class="popBnt cancer">{{msgDict.choose}}</view>
			<view class="popBnt" @click="btnSizeCancerSex">
				<uni-icons type="closeempty" color="#ccc" size="20"></uni-icons>
			</view>
		</view>
		 <view class="pickerView">
		   <picker-view class="picker" indicator-class="indicator" :value="CategoryStrat" @change="bindSexChange" @pickstart='bindSexStartChange' @pickend='bindSexEndChange'>
				<picker-view-column class="column">
				  <view v-for="(item, index) in CategoryData" :key="index">{{item.value}}</view>
				</picker-view-column>
			</picker-view>
		</view>
		<view class="btnPopSizeGroup">
			<view class="btnPopSize showBtnBackColor" @click="btnSizeConfirmSex">
				{{msgDict.confirm}}
			</view>
		</view>
	</view>
</uni-popup>
	</view>
</template>

<script>
	import numbox from '@/components/numbox/numbox.vue'
	import {suitsInfo,operateCar,listCar,clearCar,editCar,oneKey} from '../../api/index.js'
	export default {
		data() {
			return {
				type:'',
				skuListDict:{},
				swiperIndex:0,
				selectItem:{},
				goodsId:'',
				selectIndex:0,
				itemListG:[],//
				cartList:[],
				orderNum:0,
				carId:'',
		        showPrice:'0.00',
				infoPics:['../../static/school.jpg'],
				saleId:'',
				stuId:'',
				userId:undefined,
				skuList:{},
				schoolId: "",
				sendType:'',
				totalPrice:33,
				productName:'',
				canBtn:false,
				maxHight:0,
				allSelCheak:true,
				zIndex:10,
				necessaryArr:[],
				picUrlsLength:0,
				necessaryFatherDict:{},//必选的数据，防止删除
				CategoryIndex:-1,//必选的index
				CategoryStrat:[0],//必选的开始位置
				CategoryData:[],//必选的数据源
				isExistence:'',//是不是必选里 0 否，1 是有
				msgDict:{}
			}
		},
		onLoad(option) {
			
			if (option.type) {
				this.goodsId = option.goodsId
				this.type = option.type;
				this.saleId = option.saleId;
				this.schoolId = option.schoolId;

				this.skuListDict = JSON.parse(decodeURIComponent(option.skuListDict));
				this.necessaryFatherDict =JSON.parse(decodeURIComponent(option.needFAtherArr)); 
				this.isExistence = option.isExistence
				
				this.listStus()

			}
		    this.msgDict = getApp().globalData.$t('shopGood');
			this.userId = getApp().globalData.userId;
			this.stuId = getApp().globalData.stuId;
			this.NewlistCar('');
			let sysInfo = uni.getSystemInfoSync();
			// console.log('sys',sysInfo)
					   
			this.maxHight = sysInfo.windowHeight - 240
			
			
		},
methods: {
	async listStus(){
		
		let {result} = await suitsInfo({type:this.type,saleId:this.saleId});
		if (result.length >0) {
			
			let endArr = result.map((v,i)=>{
				
				v.showSizeStr = this.msgDict.choose // 必选商品选择的样式

				return v
			})
			
			this.selectItem = endArr[this.selectIndex];
			this.picUrlsLength = this.selectItem.picUrls.length;
			this.itemListG = endArr;
	
		}
	},
	//加入购物车接口
	async NewoperateCar(typeStr,itemNum){
	
		try{
						
			let pushDict ={code:0,data:[]};
			pushDict.code = this.skuList.code;
			pushDict.data[0]=this.skuList.data[this.skuList.selIndex];
	
			let dict ={carType:this.type,saleId:this.saleId,goodsId:this.goodsId,num:itemNum,size:pushDict,studentId:this.stuId,userId:this.userId};
					
			let {result} = await operateCar(dict,false);
			
			
			this.NewlistCar();
			// this.NewlistCar('reload');
			this.skuList.selNum = itemNum;
			if (typeStr == 'add') {
				if (this.isExistence == 1) {
				
					this.necessaryFatherDict[this.goodsId].showNum ++
				
				}
				uni.showToast({
					title:this.msgDict.Operation,
					icon:'none'
				})
				
				
			} else{
				if (this.isExistence == 1) {
				
					this.necessaryFatherDict[this.goodsId].showNum ++
				
				}
				uni.showToast({
					title:this.msgDict.Operation,
					icon:'none'
				})
				
				
			}			
		} catch(err) {
			console.log('我请求啦',err);
			uni.showToast({
				title:err.message,
				icon:'none'
			})
		}
	},
//购物车列表
async NewlistCar(){
			  
	let {result} = await listCar({userId:this.userId,carType:this.type,studentId:this.stuId},true);
	
			if ( result.length >0) {
				
				let item = result[0];
				console.log('item',item);
				
				
				this.carId = item.carId;
				if (item.list == null||item.list.length == 0) {
				
					this.showPrice = '0.00';
					this.orderNum = 0;
					this.cartList = []
				    
					return
				}
				if (this.type == '1') {
					
				this.sendType = item.sendType
					
				}else{
				//默认到家
				this.sendType = '2'
				}
				this.showPrice = item.totalPrice;
				this.orderNum = item.list.length;
				
				this.cartList= item.list.map(v=>{
					
					v.isChecked =true;
					return v
				});
				
			} else{
				this.showPrice = '0.00';
				
				this.orderNum = 0;
				this.cartList = []
			}

},
//删除
async NewclearCar(){

	try{
				
		let dict ={carType:this.type,studentId:this.stuId,userId:this.userId};
		let {result} = await clearCar(dict);
		uni.showToast({
			title:this.msgDict.Operation,
			icon:'none'
		})
				
		this.showPrice = '0.00';
		
		this.orderNum = 0;
		this.cartList = [];
		this.$refs.popup.close();
	
		
	} catch(err) {
		console.log('我请求啦',err);
		uni.showToast({
			title:err.message,
			icon:'none'
		})
	}
},
async newEditCar(sonItem,btnType,faindex){
	try{
	
	if(btnType == 'add'){
		//加
		let  num = sonItem.num+1;
		let res = await editCar({carDetailId:sonItem.carDetailId,userId:this.userId,carType:this.type,studentId:this.stuId,num:num},false);
		sonItem.num = num
		
		this.mySkuListDictNumChange(sonItem.goodsId,num,sonItem.size.data[0].value)
		if (this.isExistence == '1') {
		 this.mycartNeedNumChange(sonItem.goodsId,'add')
		}
		
		if(sonItem.isChecked){
			
			let  showPrice = this.showPrice ;
			this.showPrice = (parseFloat(showPrice) + parseFloat(sonItem.price)).toFixed(2)
		}
		
	}else{
		//减
		
		let  num = sonItem.num-1;
		let  res = await editCar({carDetailId:sonItem.carDetailId,userId:this.userId,carType:this.type,studentId:this.stuId,num:num},false);
	    this.mySkuListDictNumChange(sonItem.goodsId,num,sonItem.size.data[0].value)
		if(sonItem.isChecked){
			let  showPrice = this.showPrice;
			
			this.showPrice = (parseFloat(showPrice) - parseFloat(sonItem.price)).toFixed(2)
			
		}
		if (this.isExistence == '1') {
			
		 this.mycartNeedNumChange(sonItem.goodsId,'det')
			
		}
		
		
		
		
		if(num <=0){
			this.cartList.splice(faindex,1);
					if(this.cartList.length == 0){
					
						this.$refs.popupContent.close();
					}

		}else{
			sonItem.num = num
		}
		
	}

	
	} catch(err) {
		console.log('我请求啦',err);
		uni.showToast({
			title:err.message,
			icon:'none'
		})
	}


},
//一键加入购物车
async requstOneKey(){

	try{
			
		let endArr = [];
		this.necessaryArr.forEach(v=>{
			
			endArr.push({goodsId:v.goodsId,num:v.needNum,size:v.showSizeDict});
			
		})		
		let dict ={carId:this.carId,list:endArr};
		let {result} = await oneKey(dict);
		uni.showToast({
			title:this.msgDict.Operation,
			icon:'none'
		})
		
		let findItem = this.endArr.find(v=>{
		
		    return  v.goodsId == this.goodsId
		  
		})
		
		if (findItem) {
			
		  this.mySkuListDictNumChange(this.goodsId,findItem.num,findItem.size.data[0].value)
			
		}
	
		this.$refs.popNecessary.close();
		
		endArr.forEach(v=>{
			this.necessaryFatherDict[v.goodsId] = v.num
		})
		
		this.necessaryArr = [];
		
		
		this.NewlistCar('reload');
				

	} catch(err) {
		console.log('我请求啦',err);
		uni.showToast({
			title:err.message,
			icon:'none'
		})
	}
},
toSetting(){
	// debugger
	let pages = getCurrentPages();
	let page = pages[2];
	page.$vm.isNeedReald = true;
	
	uni.navigateBack({
		delta:1
	})

	
},
btnDetAll(){
	
	uni.navigateTo({
		url:'../privateChat/privateChat'
	})
	
},
changeIndex(e) {
	// console.log('index',e);
	this.swiperIndex = e.detail.current + 1;

},
// 必选的减
btnNeedDetClick(index,itemNum){
	  let item  =  this.necessaryArr[index];
	  
	  if (itemNum  <= 1) {
		
		uni.showToast({
			title:this.msgDict.needOne,
			icon:'none'
		})
	  } else{
		  
		item.needNum = itemNum - 1;
		this.necessaryArr.splice(index,1,item);
		
		
		
	  }
},
// 必选的加
btnNeedAddClick(index,itemNum){
			  
  let item  =  this.necessaryArr[index];
  
  if (itemNum < item.maxNum) {
	// debugger
	item.needNum = itemNum + 1;
	
	this.necessaryArr.splice(index,1,item)
		
  } else{
	uni.showToast({
		title:this.msgDict.restricted+item.maxNum + this.msgDict.piece,
		icon:'none'
	})
  }
			  
},
			
//必选弹出选择框
btnNeedSizeClick(index){
	
	  this.CategoryIndex = index;
	  this.CategoryStrat = [0];
	  this.CategoryData = this.necessaryArr[index].size.data;
	  
	  // this.$refs.popNecessary.close();
	  this.$refs.popSzieData.open();
			  
			  
},
btnsuitItemClick(index){
	
	if (index != this.selectIndex) {
		this.selectIndex = index
		this.selectItem = this.itemListG[index];
	} else{
		
	}
	
	
},
//尺寸添加购物车
btnNumboxAddClick(){
			  
	  if (this.selectItem.izRequired == 1) {
		
		if (this.selectItem.maxNum <= this.skuList.selNum) {
							
				uni.showToast({
					title:this.msgDict.restricted+this.selectItem.maxNum + this.msgDict.piece,
					icon:'none'
				})
				return
							
		}

	  }
	  if (this.skuList.selStock <= this.skuList.selNum) {
		
		uni.showToast({
			title:this.msgDict.restricted+this.skuList.selStock + this.msgDict.piece,
			icon:'none'
		})
		return
		
	  }

	  // this.skuList.selNum = this.skuList.selNum +1;
	  this.NewoperateCar('add',this.skuList.selNum +1);
			  
},
btnNumboxDetClick(){
			  
	  this.NewoperateCar('det',this.skuList.selNum -1);
			 
},
btnSizeClick(item,index){
	if (this.skuList.selIndex > -1) {
		
	   this.skuList.data[this.skuList.selIndex].saledStock = this.skuList.selNum;
		
	}
	
	this.skuList.selIndex = index;
	this.skuList.selStock = item.stock;
	this.skuList.selNum =   item.saledStock
	this.skuList.selItem = item.value;
	this.$refs.popup.close();		  
},
btnClose(){
  this.$refs.popupAddCart.close();  
},
//加入购物车
btnSpecifications(){
	
	this.skuList = this.skuListDict;
	this.zIndex = 10;
	this.$refs.popupAddCart.open();
	
			  
},
//结算
toPayOrder(){

	  if (this.isExistence == '1') {
		  let necessaryArr =Object.values(this.necessaryFatherDict).filter(function(currentValue){
				   
		   return currentValue.showNum > 0;
				
			})
				
		  if (necessaryArr.length >0) {
		  	
			  this.necessaryArr = necessaryArr;
			  
			  this.$refs.popNecessary.open();
			  this.zIndex = 10
			
			  return;
		  	
		  }		
		  
			
		}

   if (this.orderNum == 0) {
	
		uni.showToast({
			title:this.msgDict.needSelect,
			icon:'none'
		},1500)
		
		return
   }
  if (this.allSelCheak) {
					
		this.$refs.popup.close();

		uni.redirectTo({
			url:'../waitPay/waitPay?cartList='+encodeURIComponent(JSON.stringify(this.cartList))+'&cartType='+this.type+'&showPrice='+this.showPrice+'&orderNum='+this.orderNum+'&sendType='+this.sendType+'&schoolId='+this.schoolId
		})
	} else{
			
		let gitCartList = this.cartList.filter(v=>{
			
			return v.isChecked 
		})
		
		this.$refs.popup.close();
		
		// console.log('gitCartList',gitCartList);
		
		uni.redirectTo({
			url:'../waitPay/waitPay?cartList='+encodeURIComponent(JSON.stringify(gitCartList))+'&sendType='+this.sendType+'&cartType='+this.type+'&showPrice='+this.showPrice+'&orderNum='+this.orderNum+'&schoolId='+this.schoolId
		})

	}
},
//加入购物车
btnAddCartClick(event){
			  
	  // console.log('event',event);
	  if (this.skuList.selIndex == -1) {
		uni.showToast({
			title:this.msgDict.addCart,
			icon:'none'
		})
		return
	  }
	  this.skuList.data[this.skuList.selIndex].selStorck = 1
	  this.NewoperateCar('add',1);
			  
},
//底部购物车列表选择
btnChangeCheckbox(){
			  
	  let allSelCheak = !this.allSelCheak;
	  this.allSelCheak = allSelCheak;
	  
	  
	  
	  if (allSelCheak == false) {
		this.cartList.map(v=>{	  
			  v.isChecked = allSelCheak
			  return v
		})
		this.showPrice = '0.00';
		this.orderNum = 0;
	  } else{
		let showPrice = 0.00;
		this.cartList.map(v=>{
			v.isChecked = allSelCheak
			showPrice = showPrice + v.num*v.price;
			
		})
		this.showPrice = showPrice.toFixed(2);
		this.orderNum = this.cartList.length
	  }
			  
},
//底部购物车关闭弹窗
colsePopup(){
			  
	uni.showModal({
		content:this.msgDict.emptyCart,
		cancelText:this.msgDict.cancel,
		confirmText:this.msgDict.confirm,
		success: (res) => {
			if (res.confirm) {
				
			 this.NewclearCar();
				
			}
		}
	})	
	 
			  
},
//打来底部购物车列表
btnOpencartClick(){
			  
			  
	  if (this.cartList.length == 0) {
		
	  return
		
	  }
	  this.zIndex =120;
	  this.$refs.popup.open();
			  
},

btnPopAddClick(index){
	  let  sonItem  = this.cartList[index];
	  if (sonItem.size.data.stock <= sonItem.num) {
		
		uni.showToast({
			title:this.msgDict.restricted+sonItem.size.data.stock + this.msgDict.piece,
			icon:'none'
		})
		
	  } else{
		
		this.newEditCar(sonItem,'add',index)
		
	  }
},
btnPopDetClick(index){
		  let  sonItem  = this.cartList[index];
		  if (sonItem.num <= 0) {

			return
			
		  } else{
			
			this.newEditCar(sonItem,'det',index)
			
		  }
},
btnselectedClick(index,checkType){
			  
	  if (checkType&& this.allSelCheak) {
		// this.cartList[index].isChecked = !checkType
		this.allSelCheak = !checkType
		let showPrice = 0.00;
		this.cartList.forEach((v,i)=>{
			
			if (sonIndex == i) {
				
			v.isChecked = false
				
			}else{
				showPrice = showPrice + v.num*v.price;
			}
		})
		
		 this.showPrice = showPrice.toFixed(2);
		
		
	  } else{
		this.cartList[index].isChecked = !checkType
		
		let result1 =  this.cartList.every(v=>{
			
			return v.isChecked == !checkType
		})
		
		if (result1) {
			
		this.allSelCheak = !checkType
			
		}
		
		let showPrice = 0.00;
		this.cartList.forEach((v,i)=>{
			
			if (v.isChecked) {
				
			showPrice = showPrice + v.num*v.price;
				
			}
		})
		this.showPrice = showPrice.toFixed(2);
		
	  }

},
mySkuListDictNumChange(gooodsId,num,code){
	if (gooodsId == this.goodsId) {
	
	   if (this.skuListDict.selItem && this.skuListDict.selItem == code ) {
	   	
		this.skuListDict.selNum = num
		
	   }else{
		  
		  this.skuListDict.data.forEach(v=>{
			  
			  if (v.value == code) {
			    v.saledStock = num
			  }
			  
		  })
		   
	   }
	   
		
	}
	
	
	
},
//必选商品所有商品数量修改
mycartNeedNumChange(gooodsId,typeStr){
	
	
	    // showNum 展示的数量，用来判断必选客户
	   //该商品是必选
		if (this.necessaryFatherDict[gooodsId]) {
			
			if (typeStr == 'add') {
				
				this.necessaryFatherDict[gooodsId].showNum ++
				
			} else{
				
				this.necessaryFatherDict[gooodsId].showNum --
			}
			

		}
	
},
//必选取消按钮
btnSizeCancerSex(){
	this.$refs.popSzieData.close();
},
//必选确认按钮
btnSizeConfirmSex(){
			  
  if (this.canBtn) {
	
	return;
	
  }
  let faindex = this.CategoryIndex;
  let selIndex = this.CategoryStrat[0];
  let item  = this.necessaryArr[faindex];
  item.showSizeDict.code = item.size.code;
  item.showSizeDict.data = [this.CategoryData[selIndex]];
  item.showSizeStr = this.CategoryData[selIndex].value;
  
  this.necessaryArr.splice(faindex,1,item);
  
  this.$refs.popSzieData.close();
			  
},
//取消必选的商品弹出窗
btncolseNeedPopupClick(){
	 this.$refs.popNecessary.close();
},
bindSexChange(e){
	console.log('bindCategoryChange',e);
	this.CategoryStrat=e.detail.value;
	
},
bindSexStartChange(){
	console.log('321开始转动');
	this.canBtn = true
	
},
bindSexEndChange(){
	console.log('321结束转动');
	this.canBtn  =false
},
//必选的一键添加
btnAddAllClick(){
			  
	let result1 = this.necessaryArr.some(v=>{

	    return  v.showSizeStr == this.msgDict.choose
	  
	})
	  
	if (result1) {
		
	   uni.showToast({
		title:this.msgDict.selectSize,
		icon:'none'
	   },1500)
		
		return
	 }
	  
	this.requstOneKey();

    }
},
components:{
	numbox:numbox
}
}
</script>

<style lang="less">
	
	page{
		background-color: #f2f2f2;
		height: 100%;
	}
	.popupContent {
		
		background-color: #fff;
		padding-top: 20rpx;
		padding-right: 20rpx;
		padding-bottom: 140rpx;
		padding-bottom: calc(140rpx + constant(safe-area-inset-bottom));  
		padding-bottom: calc(140rpx + env(safe-area-inset-bottom));
		
		.titleG {
			
			display: flex;
			justify-content: space-between;
			padding: 10rpx 0rpx;
			// margin-right:30rpx;
			border-bottom: thin solid #f2f2f2;
			margin-left: 20rpx;
			
			.popCheck{
				display: flex;
				flex-direction: row;
				align-items: center;
				.classCheak{
					font-size: 30rpx;
					font-weight: 400;
					color: #666666;
					padding-bottom: 5rpx;
				}
				
			}
			.popDelete{
				font-weight: 400;
				color: #B0B0B8;
				font-size: 24rpx;
				
				.uni-icons{
					position: relative;
					top: 3rpx;
				}
			}
		
		}
		
	
		.coupons {
			padding-right: 20rpx;
			width: 100%;
			// box-sizing: border-box;
			margin-top: 32upx;
			
			.goodsItem {
				// background-color: #007AFF;
				height: 160rpx;
				display: flex;
				flex-direction: row;
				margin-bottom: 20rpx;
				
				
				.check {
					display: flex;
					align-items: center;
					justify-content: center;
					width: 80rpx;
					height: 100%;
				}
			
				.goodsInfo {
					flex:1;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: space-between;
			
					// border-bottom: 1upx solid #ccc;
					// margin-top: 20upx;
					// margin-bottom: 20upx;
					.img-box {
						// display: flex;
						// flex-direction: column;
						width: 150upx;
						height: 150upx;
						background-color: #d8d8d8;
						// margin-left: 20upx;
						position: relative;
			            overflow: hidden;
						border-radius: 8rpx;
						border: thin solid #f2f2f2;
						.img {
							width: 100%;
							height: 100%;
						}
			
						.backView {
							position: absolute;
							bottom: 0upx;
								right: 0;
							width: 200upx;
							height:34upx;
							background: rgba(0, 0, 0, 0.5);
							font-size: 16upx;
							font-weight: 300;
							color: #FFFFFF;
							text-align:center;
						    line-height: 30rpx;
						}
					}
			
					.text-box {
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						overflow: hidden;
						// background-color: #FAECD8;
						margin-left: 20upx;
						width: 470rpx;
						height: 100%;
			
						.goods-title {
							display: flex;
								justify-content: space-between;
							// align-items: center;
								
								.two-omit{
									font-size: 32upx;
									color: #333333;
									// padding: 0upx 20upx 10upx 0;
									font-weight: bold;
									
								}
								
								.goods-price{
									font-size: 28upx;
									color: #000;
									font-weight: 500;
									white-space: nowrap;
								}
						}
			
						.itemBottom {
							display: flex;
							align-items: center;
							justify-content: space-between;
							height: 60rpx;
			
							.goods-lable {
								font-size: 28upx;
								color: #ccc;
								font-weight: 400;	
							}
						}
		
					}
				}
			
			}
		
		}
		
	}
	.user-info {
		width: 100%;
		height: auto;
		position: relative;
		
		.swiperBox {
			position: relative;
			height: 750rpx;
			.swiperContainer {
				width: 100%;
				height: 750rpx;
				.swiperItem {
					width: 100%;
					height: 100%;
					
					image {
						width: 100%;
						height: 100%;
						display: block;
					}
					
				}
			}
			
			.cal {
				position: absolute;
				right: 40upx;
				bottom: 30upx;
				font-size: 28upx;
				color: #1f1f1f;
				line-height: 60upx;
				
				text {
					font-size: 42upx;
					font-weight: bold;
					color: #000;
					line-height: 60upx;
				}
			}
		}
	   
	   .suitGView{
		   display: flex;
		   flex-direction: row;
		   flex-wrap: wrap;
		   margin-top:  20rpx;
		   padding: 20rpx;
		   background-color: #fff;
		   
		   .suitItem{
			   width: 150rpx;
			   height: 150rpx;
			   
			   margin-right: 20rpx;
			   
			   image{
				   height: 100%;
				   width: 100%;
				   border-radius: 10rpx;
				   border: 1rpx solid #f2f2f2;
			   }
			   .suitItemActive{
			   	   border: 1rpx solid #2967F2;
			   }
		   }
		   
		  
		   
	   }
	   
		.topView{
			position: fixed;
			width:710rpx;
			left: 20rpx;
			top: var(--status-bar-height);
			display: flex;
			justify-content: space-between;
			.btnLeft{
				width:  44px;
				height: 44px;
				.setIcon{
					width: 60rpx;
					height: 60rpx;
				}
			}
			
			.lab2{
				display: flex;
				
				align-items: center;
				font-size: 28upx;
				color: #888;
				.custom{
					width: 40rpx;
					height: 40rpx;
				}
			}
		}
	}
	.detail{
		
		background-color: #FFFFFF;
		border-bottom:20rpx solid #F8F9FD;
		border-top:20rpx solid #F8F9FD;
		padding: 20rpx 30rpx 0rpx;
		
		
		.titileG{
			display: flex;
			flex-direction: row;
			align-items: center;
			.labIzRequired {
				color: #FDAC3D;
				background-color: #FFF1DF;
				font-size: 22rpx;
				text-align: center;
				padding: 0 3rpx;
				// width: 100rpx;
				height: 30rpx;
				line-height: 30rpx;
				border-radius: 10rpx;
				
				margin-right: 30rpx;
			}
			
			.title{
				font-size: 36rpx;
				font-weight: 400;
				color: #333;
				
			}
		}
		
		// 不是弹窗
		.needLab{
				  	
			border-radius: 10rpx;
			background-color: #EAF2FE;
			// padding: 5rpx 10rpx;
			color: #548CE7;
			font-size: 22rpx;
			font-weight: 500;
			text-align: center;
			// width: 60rpx;
			padding: 0 3rpx;
			height: 30rpx;
			line-height: 30rpx;
			margin-top: 30rpx;
			margin-bottom: 30rpx;
			padding: 2rpx 10rpx;
			
			display: initial;
			// margin-right: 10rpx;
		  }
		.detailNum {
			margin-top: 20upx;
			display:flex;
			justify-content: space-between;
			align-items: center;
			
			.moneyG{
				display: flex;
				flex-direction: row;
				align-items: center;
				
				.detailMoney{
				
					font-size: 32upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color:#F54353;
					margin-bottom: 24upx;
					height: 70rpx;
					line-height: 70rpx;
					
					 text{
						 font-size: 48rpx;
					 }
				}
				
			}
		}
		
		
		.detailBtnAdd{
			background:linear-gradient(135deg, #2D63F9 0%, #6421D3 100%);
			color: #fff;
			font-size: 28rpx;
			height: 60rpx;
			border-radius: 30rpx;
			width: 200rpx;
			text-align: center;
			line-height: 60rpx;
			
		}
	}
	
   .jiesuan-box {
   	display: flex;
   	justify-content: space-between;
   	width: 750rpx;
   	height: 100upx;
   	// border-radius: 50rpx;
   	position: fixed;
	bottom: 0rpx;
	bottom: calc(0rpx + constant(safe-area-inset-bottom));  
	bottom: calc(0rpx + env(safe-area-inset-bottom));
   	left: 0rpx;
   	border-top: 1px solid #eee;
   	background-color: #fff;
   
   	.left-price {
   		display: flex;
   		width: 510upx;
   		justify-content: flex-start;
   		padding: 0 30upx 0 10rpx;
   		font-size: 28upx;
   		box-sizing: border-box;
   		align-items: center;
   
   		.all_select_box {
   			width: 80rpx;
   			height: 80rpx;
   			background: #FFB34D;
   			display: flex;
   			align-items: center;
   			justify-content: center;
   			border-radius: 50%;
   			position: relative;
   			.seleNum{
   				position: absolute;
   				top: -10rpx;
   				right: 0;
   				
   				background-color: #F54353;
   				color: #fff;
   				height: 22rpx;
   				font-size: 16rpx;
   				padding: 0 8rpx;
   				text-align: center;
   				border-radius: 11rpx;
   				line-height: 22rpx;
   			}
   			
   		}
   
   		.total {
   			margin-left: 20rpx;
   			display: flex;
   			flex-direction: column;
   			justify-content: space-between;
   			color: #333;
   			font-size: 22rpx;
			height: 80rpx;
   			.totalMoney{
   				color: #F54353;
   			}
   
   		}
   	}
   	.to-pay-btn {
   		width: 202upx;
   		text-align: center;
		height: 74rpx;
   		line-height: 74rpx;
   		font-size: 28upx;
   		color: #ffffff;
   		background: linear-gradient(135deg, #2D63F9 0%, #6421D3 100%);
		border-radius:37rpx;
		margin-top: 15rpx;
		margin-right: 20rpx;
   		
   	}
   }
   //必须商品弹出窗
   .popNeedContent{
   	background-color: #FFFFFF;
   	padding-bottom: 20rpx;
   	border-radius: 20rpx;
   	width: 640rpx;
   	
   	.titleG{
   		background-color: #fff;
   		border-bottom: 1px solid #ccc;
   		height: 80rpx;
   		display: flex;
   		justify-content: space-between;
   		align-items: center;
   		padding-left: 30rpx;
   		padding-right: 20rpx;
   		border-radius: 20rpx 20rpx 0 0;
   		.popCheck{
   			font-size: 32rpx;
   			color: #333;		
   		}
   	}
   	.needGoods{
   		padding: 30rpx;
   		.coupons {
   			width: 100%;
   			box-sizing: border-box;
   			max-height: 540upx;
   			 .goodsItem {
   			 	// background-color: #007AFF;
   			 	height: 160rpx;
   			 	display: flex;
   			 	flex-direction: row;
   			 	margin-bottom: 20rpx;
   			 	
   			 	
   			 	.check {
   			 		display: flex;
   			 		align-items: center;
   			 			justify-content: center;
   			 			width: 80rpx;
   			 			height: 100%;
   			 	}
   			 
   			 	.goodsInfo {
   			 		flex:1 0 0%;
   			 		display: flex;
   			 		flex-direction: row;
   			 		align-items: center;
   			 		justify-content: space-between;
   			 
   			 		// border-bottom: 1upx solid #ccc;
   			 		// margin-top: 20upx;
   			 		// margin-bottom: 20upx;
   			 		.img-box {
   			 			// display: flex;
   			 			// flex-direction: column;
   			 			width: 150upx;
   			 			height: 150upx;
   			 			background-color: #d8d8d8;
   			 			// margin-left: 20upx;
   			 			position: relative;
   			            overflow: hidden;
   			 			border-radius: 8rpx;
   			 			border: thin solid #f2f2f2;
   			 			.img {
   			 				width: 100%;
   			 				height: 100%;
   			 			}
   			 
   			 			.backView {
   			 				position: absolute;
   			 				bottom: gx;
   			 			    right: 0;
   			 				width: 200upx;
   			 				height:34upx;
   			 				background: rgba(0, 0, 0, 0.5);
   			 				font-size: 16upx;
   			 				font-weight: 300;
   			 				color: #FFFFFF;
   			 				text-align:center;
   			 			    line-height: 30rpx;
   			 			}
   			 		}
   			 
   			 		.goodsDetailBox {
   			 			display: flex;
   			 			// flex-direction: column;
   			 			justify-content: space-between;
   			 			overflow: hidden;
   			 			// background-color: #FAECD8;
   			 			margin-left: 20upx;
   			 			width: 400rpx;
   			 			height: 100%;
   			 
   			 			.goods-title {
   			 				display: flex;
   			 				justify-content: space-between;
   							flex-direction: column;
   			 				// align-items: center;
   			 					
   			 					.two-omit{
   			 						font-size: 32upx;
   			 						color: #333333;
   			 						// padding: 0upx 20upx 10upx 0;
   			 						font-weight: bold;
   			 						
   			 					}
   									
   			 					.needLab{
   			 						
   			 						border-radius: 8rpx;
   			 						background-color: #FFF1DF;
   			 						color: #FDAC3D;
   			 						font-size: 22rpx;
   			 						font-weight: 500;
   			 						text-align: center;
									width: 120rpx;
   			 					
   			 					}
   			 					.goods-price{
   			 						font-size: 28upx;
   			 						color: #e54d42;
   			 						font-weight: 500;
   			 						white-space: nowrap;
   			 					}
   			 			}
   			 
   			 			.itemBottom {
   			 				// margin-top: 20upx;
   			 				display: flex;
   			 				align-items: flex-end;
   			 				justify-content: space-between;
   							flex-direction: column;
   							margin-left: 30rpx;
   							
   
   			 				// height: 60rpx;
   			 
   			 				.goods-lable {
   			 					font-size: 28upx;
   			 					color: #ccc;
   			 					font-weight: 400;	
   			 				}
   							.needNum{
   								font-size: 24upx;
   								color: #ccc;
   								font-weight: 400;	
   							}
   							.goodSize{
   								display: flex;
   								align-items: center;
   								white-space:nowrap;
   								.btnSize{
   									border-radius: 10rpx;
   									background-color: #f2f2f2;
   									border: thin solid #ccc;
   									// padding: 15rpx 10rpx;
   									text-align: center;
   									width: 90rpx;
   									color: #808080;
   									font-size:24rpx;
   									margin-left: 10rpx;	
   									height: 45rpx;
   									line-height: 45rpx;
   									
   								}
   							}
   							
   			 			}
   			 		
   			 		}
   			 	}
   			 
   			 }
   			 		
   			}
   			
   	}
   	.btnAddAllGroup{
   		border-top:thin solid #f2f2f2;
   		padding: 30rpx 80rpx 10rpx;
   		
   		.btnAddAll{
   		   color: #fff;
   		   background-color: #FF1493;
   		   height: 95rpx;
   		   line-height: 95rpx;
   		   border-radius: 10rpx;
   		   font-size: 32rpx;
   		   text-align: center;
   					   
   		}
   	}
   	
   	
   }
   .categoryContent{
   	width: 750upx;
   	background-color: #fff;
   	// padding-bottom: 40rpx;
   	.pickerBtn{
   		height: 101rpx;
   		line-height: 101rpx;
   		background-color: #fff;
   		font-size: 30rpx;
   		display: flex;
   		justify-content: space-between;
   		border-bottom: thin solid #ccc;
   		padding: 0 20rpx;
   		
   		.popBnt{
   			// width: 80upx;
   			text-align: center;
   		}
   		.cancer {
   			color: #888;
   		}
   		.confirm{
   			color: #4CD964;
   		}
   	}
   	.picker {
   	  background-color: #fff;
   	  width: 100%;
   	  height: 370rpx;
   	  }
   	  .column {
   		font-size: 40rpx;
   		color: #000;
   		text-align: center;
   		line-height: 80rpx;
   	  }
   	  .indicator {
   		  height: 80rpx;
   		  border-top: thin solid #f2f2f2;
   		  border-bottom:thin solid #f2f2f2;
   	  }
   	  .btnPopSizeGroup{
   		  
   		  bottom: 0rpx;
   		  bottom: calc(0rpx + constant(safe-area-inset-bottom));  
   		  bottom: calc(0rpx + env(safe-area-inset-bottom));
   		  
   		  .btnPopSize{
   			  
   			  color: #fff;
   			  // background-color: #FF1493;
   			  height: 100rpx;
   			  line-height:100rpx;
   			  // border-radius: 10rpx;
   			  font-size: 32rpx;
   			  text-align: center;
   			  
   		  }
   		  
   	  }
   	
   }
   .popupAddCartCon{
   	// margin:0 40rpx;
   	background-color: #FFFFFF;
   	padding:  30rpx 0 40rpx;
	border-radius: 20rpx;
	width: 640rpx;
	
	.titleG{
		display: flex;
		margin: 0 20rpx;
		// width:;
		justify-content: space-between;
		.title{
			
			display: flex;
			flex-direction: row;
			
			font-size: 36rpx;
			color: #333;
			
			.labIzRequired {
				color: #FDAC3D;
				background-color: #FFF1DF;
				font-size: 22rpx;
				text-align: center;
				// width: 103rpx;
				padding: 0 3rpx;
				height: 30rpx;
				line-height: 30rpx;
				border-radius: 4rpx;
				margin-top: 10rpx;
				margin-right: 30rpx;
			}
		}
	}
	
	
	.selefctList {
		padding-right: 20upx;
		// margin-top: 20rpx;
		.needLab{
			
			border-radius: 8rpx;
		    background-color: #EAF2FE;
			padding: 0rpx 10rpx;
			color: #548CE7;
			font-size: 22rpx;
			font-weight: 500;
			text-align: center;
			// width: 82rpx;
			display: initial;
			height: 30rpx;
			line-height: 30rpx;
			margin-left: 20rpx;
			// margin-right: 10rpx;
		}
		.selectTitle {
			
			font-size: 26upx;
			font-weight: 400;
			color: #888;
			margin-left: 20upx;
			margin-top: 10rpx;
		
		}
		.selectItems {
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			
			.keyItem {
				text-align: center;
				margin-top: 30upx;
				margin-left: 24upx;
				font-size: 24upx;
				height: 45upx;
				width: 90upx;
				border-radius: 10upx;
				color: #333333;
				line-height: 45upx;
				border: thin solid #ccc;
			}
			.keyItemActive {
				color:#0005C9;
				background-color: rgba(0, 5, 201, 0.1);;
				border-color:#2967F2;
				
			}
			.keyItemZero{
				background-color: #ccc;
			}
		}
		
	}
	.selectSku{
		height: 90rpx;
		line-height: 90rpx;
		padding-left: 20rpx;
		font-size: 22rpx;
		color: #548CE7;
		font-weight: 400;
	}

	.buy-num {
		margin-top: 54upx;
		margin-left: 20upx;
		margin-right: 20upx;
		display:flex;
		justify-content: space-between;
		align-items: center;
		
		.buy-num-title {
		
			font-size: 32upx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color:#F54353;
			height: 70rpx;
			line-height: 70rpx;
			display: flex;
			text{
				font-size:48upx;
			}
			.selSku{
				 color: #333;
				 font-size: 28rpx;
				 margin-left: 10rpx;
			}
		}
		.btnAdd{
			// background-color: #FF0000;
			color: #fff;
			font-size: 28rpx;
			height: 60rpx;
			border-radius: 30rpx;
			width: 200rpx;
			text-align: center;
			line-height: 60rpx;
			
		}
	}

	}
</style>
